<template>
  <Article :article="articleState" class="d-archive-view">
    <HtmlViewer v-model="state.items[0].content" :mode="mode" ref="htmlViewer" />
  </Article>
</template>

<script>
import { Article } from '@daelui/vdog/dist/components'
import { HtmlViewer } from '@daelui/vdog/dist/viewer'
import { parser } from '@daelui/dogjs/dist/components'
import { STATUS } from '@daelui/dogjs/dist/constant'
import chSer from '@/service/action/chapter.action'
import { state } from '@/service/stock/index.js'

export default {
  components: {
    Article,
    HtmlViewer
  },

  data () {
    return {
      STATUS,
      mode: STATUS.RENDER,
      isEdit: false, // 是否是编辑模式
      // 表单数据
      state: {
        id: '',
        name: '',
        pid: '',
        items: [{type: 'html', content: ''}],
        status: 1,
        order: 1,
        updateTime: '',
        updateUser: '',
        createTime: '',
        createUser: ''
      },
      // 状态列表
      statusList: state.statusList,
      // 产品列表
      productList: []
    }
  },

  computed: {
    articleState () {
      return {
        title: this.state.name
      }
    }
  },

  methods: {
    /**
     * @function 加载数据
    */
    loadItem (id) {
      chSer.queryItem({ id }).then(result => {
        let data = result.data || {}
        data.items = parser.parse(data.items, 'array', true, [{type: 'html', content: ''}])
        this.state = data
        this.$refs.htmlViewer.update(data.items[0].content)
      })
    }
  },

  beforeMount () {
    let params = this.$route.params
    // 加载详细
    this.loadItem(params.id)
  },

  mounted () {

  }
}
</script>

<style scoped>
.d-archive-view {
  flex: 1;
  background: #fff;
}
</style>
